<template>
	<view>
		<!-- 我是消息页面的内容
		<navigator url="../index/index" open-type='switchTab'>
			<button type="default">index222444</button>
		</navigator> -->
		
		<!-- 引入字体图标  为什么没显示????-->
		<view class=" box">
			
			<view class="iconfont  icon-ziyuan">
			</view>
		</view>
		
		<button type="primary" @click="handle(20,$event)">dianji</button>
		
		<button type="primary" @click="shuaxin">点击刷新</button>
		
		<!-- <button type="primary" @click="htpsfunc">请求</button> -->
		
		<!-- <button type="primary" @click="setdata">存储数据</button>
		<button type="primary" @click="setdata2">获取数据</button>
		<button type="primary" @click="setdata3">移除数据</button>
		
		
		<button type="primary" @click="chooseImg">上传图片</button>
		<image v-for="item in imgArr" :key="item" :src="item" @click="previewImg(item)"></image>
		
		<view v-for="(item,i) in list" :key="i" class="box3">
			{{item}}
		</view> -->
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:['11','22','33'],
				inum:0,
				imgArr:[]
			}
		},
		methods: {
			// 事件对象 $event
			handle(num,e) {
				console.log(num,e)
			},
			// 通过函数进行下拉刷新
			shuaxin() {
				console.log('用户点击了下拉刷新')
				uni.startPullDownRefresh()
				setTimeout(()=>{
					this.list = ['a','b','c']
					// 更新完数据后, 关闭下拉刷新
					uni.stopPullDownRefresh()
				},1500)
			},
			// https://ugo.botue.com
			// htpsfunc() {
			// 	uni.request({
			// 	    url: '', 
			// 	    // data: {
			// 	    //     text: 'uni.request'
			// 	    // },
			// 	    // header: {
			// 	    //     'custom-header': 'hello' //自定义请求头信息
			// 	    // },
			// 	    success: (res) => {
			// 	        console.log(res.data);
			// 	        // this.text = 'request success';
						
			// 	    }
			// 	});
			// }
			setdata() {
				uni.setStorage({
				    key: 'key1',
				    data: 'hello222',
				    success: function () {
				        console.log('success');
				    }
				});
			},
			setdata2() {
				uni.getStorage({
				    key: 'key1',
				    success: function (res) {
				        console.log(res.data);
				    }
				});
			},
			setdata3() {
				uni.removeStorage({
				    key: 'key1',
				    success: function (res) {
				        console.log('移除success');
				    }
				});
			},
			//上传图片
			chooseImg() {
				uni.chooseImage({
					count:2,
					success: res => {
						this.imgArr = res.tempFilePaths
					}
				})
			},
			previewImg(item) {
				// 预览图片 把点击的图片传过来, current点击的图片 urls图片数组
				uni.previewImage({
					current:item,
					urls:this.imgArr
				})
			}
		},
		// Reach 达到  触底事件
		onReachBottom() {
			console.log('页面触底事件')
			
			if(this.inum <=5) {
				this.list = [...this.list, this.inum]
				this.inum ++
				
			}else {
				console.log('没有更多了')
				return
			}
			
		},
		// 下拉刷新
		// onPullDownRefresh() {
		// 	console.log('触发了下拉刷新')
		// 	setTimeout(()=>{
		// 		this.list = ['a','b','c']
		// 		// 更新完数据后, 关闭下拉刷新
		// 		uni.stopPullDownRefresh()
		// 	},1500)
		// },
		// 页面的 生命周期函数 e 可以拿到上个页面传递的参数
		onLoad(e) {
			console.log('页面加载了',e)
		},
		onShow() {
			console.log('页面显示')
		},
		onReady() {
			console.log('页面初次渲染完成')
		},
		onHide() {
			console.log('页面隐藏')
		},
		
	}
</script>

<style lang="scss">
	// @import url("../../static/font_nav/iconfont.css");
	.box{
		width: 200px;
		height: 200px;
		background-color: pink;
		
		view{
			color: red;
		}
	}
	// .box3{
	// 	height: 300px;
	// 	line-height: 300px;
	// 	background-color: pink;
	// 	margin: 10px;
	// }
</style>
